<template>
  <div>
    <input type="text" placeholder="Please input..." v-model="todoText" />
    <button @click="setTodo">ADD</button>
  </div>
</template>

<script setup>
import { ref, inject } from "vue";

const todoText = ref("");
const { addTodo } = inject("todoMethods");

const setTodo = () => {
  if (todoText.value.length) {
    //将视图中表单输入框的内容穿入至addTodo方法
    addTodo(todoText.value);
  }
  //清空内容
  todoText.value = "";
};
</script>